<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>active4j快速开发平台</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
  <link rel="stylesheet" href="${ctxPath}/layuiadmin/layui/css/layui.css" media="all">
  <link rel="stylesheet" href="${ctxPath}/layuiadmin/style/admin.css" media="all">
</head>
<body>

  <div class="layui-fluid">
  	<div class="layui-row layui-col-space15">
    	<div class="layui-col-sm12 layui-col-md6">
        <div class="layui-card">
          <div class="layui-card-header">
           	 CPU
          </div>
          <div class="layui-card-body">
			 <table class="layui-table" lay-skin="line">
			 	 <thead>
		              <tr>
		                  <th>属性</th>
                          <th>值</th>
		              </tr> 
		            </thead>
	            <tbody>
	              <tr>
	                <td>核心数</td>
	                <td>${server.cpu.cpuNum}</td>
	              </tr>
	              <tr>
	                <td>用户使用率</td>
	                <td id="cpuUsed">${server.cpu.used}%</td>
	              </tr>
	              <tr>
	                <td>系统使用率</td>
	                <td id="cpuSys">${server.cpu.sys}%</td>
	              </tr>
	              <tr>
	                <td>当前空闲率</td>
	                <td id="cpuFree">${server.cpu.free}%</td>
	              </tr>
	            </tbody>
	          </table>
          </div>
        </div>
      </div>
      <div class="layui-col-sm12 layui-col-md6">
        <div class="layui-card">
          <div class="layui-card-header">
           	 服务器信息
          </div>
          <div class="layui-card-body">
			 <table class="layui-table" lay-skin="line">
			 	 <thead>
		              <tr>
		                  <th>属性</th>
                          <th>内存</th>
                          <th>JVM</th>
		              </tr> 
		            </thead>
	            <tbody>
	              <tr>
	                <td>总内存</td>
	                <td>${server.mem.total}</td>
	                <td>${server.mem.jvmTotal}</td>
	              </tr>
	              <tr>
	                <td>已用内存</td>
	                <td id="memUsed">${server.mem.used}</td>
	                <td id="memJvmUsed">${server.mem.jvmUsed}</td>
	              </tr>
	              <tr>
	                <td>剩余内存</td>
	                <td id="memFree">${server.mem.free}</td>
	                <td id="memJvmFree">${server.mem.jvmFree}</td>
	              </tr>
	              <tr>
	                <td>使用率</td>
	                <td id="memUsage">${server.mem.usage}%</td>
	                <td id="memJvmUsage">${server.mem.jvmUsage}%</td>
	              </tr>
	            </tbody>
	          </table>
          </div>
        </div>
      </div>
    </div>
    <div class="layui-row layui-col-space15">
    	<div class="layui-col-sm12 layui-col-md6">
        <div class="layui-card">
          <div class="layui-card-header">
           	 JVM信息
          </div>
          <div class="layui-card-body">
			 <table class="layui-table" lay-skin="line">
            <colgroup>
              <col width="150">
              <col width="150">
              <col>
            </colgroup>
            <tbody>
              <tr>
                <td>Java名称</td>
                <td>${server.jvm.name}</td>
              </tr>
              <tr>
                <td>Java版本</td>
                <td>${server.jvm.version}</td>
              </tr>
              <tr>
                <td>启动时间</td>
                <td>${server.jvm.startTime}</td>
              </tr>
              <tr>
                <td>运行时间</td>
                <td>${server.jvm.runTime}</td>
              </tr>
              <tr>
                <td>安装路径</td>
                <td>${server.jvm.home}</td>
              </tr>
              <tr>
                <td>项目路径</td>
                <td>${server.jvm.userDir}</td>
              </tr>
            </tbody>
          </table>
          </div>
        </div>
      </div>
      <div class="layui-col-sm12 layui-col-md6">
        <div class="layui-card">
          <div class="layui-card-header">
           	 服务器信息
          </div>
          <div class="layui-card-body">
			 <table class="layui-table" lay-skin="line">
            <colgroup>
              <col width="150">
              <col width="150">
              <col>
            </colgroup>
            <tbody>
              <tr>
                <td>名称</td>
                <td>${server.sys.name}</td>
              </tr>
              <tr>
                <td>生产商</td>
                <td>${server.sys.productor}</td>
              </tr>
              <tr>
                <td>内核</td>
                <td>${server.sys.core}</td>
              </tr>
              <tr>
                <td>逻辑处理器</td>
                <td>${server.sys.cpus}</td>
              </tr>
              <tr>
                <td>系统架构</td>
                <td>${server.sys.structure}</td>
              </tr>
              <tr>
                <td>操作系统</td>
                <td>${server.sys.os}</td>
              </tr>
            </tbody>
          </table>
          </div>
        </div>
      </div>
    </div>
    <div class="layui-row layui-col-space15">
    	<div class="layui-col-sm12 layui-col-md12">
        <div class="layui-card">
	          <div class="layui-card-header">
	           	 文件系统
	          </div>
	          <div class="layui-card-body">
	          	<table class="layui-table" lay-skin="line">
		            <thead>
		              <tr>
		                  <th>盘符路径</th>
                          <th>文件系统</th>
                          <th>盘符类型</th>
                          <th>总大小</th>
                          <th>可用大小</th>
                          <th>已用大小</th>
                          <th>已用百分比</th>
		              </tr> 
		            </thead>
		            <tbody>
		            
		            @for(fileSys in server.lstFileSys){
					  <tr>
		                <td>${fileSys.dirName}</td>
		                <td>${fileSys.sysTypeName}</td>
		                <td>${fileSys.typeName}</td>
		                <td>${fileSys.total}</td>
		                <td>${fileSys.free}</td>
		                <td>${fileSys.used}</td>
		                @if(fileSys.usage > 80) {
		                	<td style="color: red">${fileSys.usage}%</td>
		                @}else{
		                	<td>${fileSys.usage}%</td>
		                @}
		              </tr>      
					@}
		            </tbody>
          		</table>
	          </div>
          </div>
       </div>
    </div>
 </div>
 
<script src="${ctxPath}/layuiadmin/layui/layui.js"></script>  
<script>
  layui.config({
    base: '${ctxPath}/layuiadmin/' //静态资源所在路径
  }).extend({
    index: 'lib/index' //主入口模块
  }).use(['index'], function() {
	  var $ = layui.$;
	 
	  setInterval(function(){ 
	  	//请求
		$.post("${ctxPath}/monitor/server/server", function(res) {
			if(res.success) {
				$("#cpuUsed").html(res.obj.cpu.used + '%');
				$("#cpuSys").html(res.obj.cpu.sys + '%');
				$("#cpuFree").html(res.obj.cpu.free + '%');
				$("#memUsed").html(res.obj.mem.used);
				$("#memJvmUsed").html(res.obj.mem.jvmUsed);
				$("#memFree").html(res.obj.mem.free);
				$("#memJvmFree").html(res.obj.mem.jvmFree);
				$("#memUsage").html(res.obj.mem.usage + '%');
				$("#memJvmUsage").html(res.obj.mem.jvmUsage + '%');
			}
		});	  
		  
	  }, 5000);
	  
	  
  });
</script>
  
</body>
</html>